<!-- 首页 -->
<template>
  <div class="body">
      <b>getters中处理的-辅助函数-{{showNum}}</b>
      <b>getters处理数据列表年龄大于18的-辅助函数-{{moreAge18}}</b>
      <i>--------{{moreAge18Length}}-----------</i>
      <h3>当前最新的count值是:{{count}}</h3>
      <button @click="handle1">-1</button>
      <button @click="handle2">-n</button>
      <button @click="handle3">异步-</button>
      <button @click="handle4">异步n</button>
  </div>
</template>

<script>
import {mapState,mapMutations,mapActions,mapGetters} from "vuex";

export default {
  computed:{
      ...mapState(['count']),
      ...mapGetters(['showNum','moreAge18','moreAge18Length'])
  },
  methods:{
      ...mapMutations(['sub','subn']),
      ...mapActions(['subAsync',"subNasync"]),

      handle1(){
          this.sub()
      },
      handle2(){
          this.subn(3)
      },

      handle3(){
          this.subAsync()
      },
      handle4(){
          this.subNasync(3)
      }         
  }
}
</script>

<style  scoped>
</style>
